<div id="content-top">
					<h2>
						Dashboard
					</h2>
					<a href="#" id="topLink">Change Order</a>
					<span class="clearFix">&nbsp;</span>
				</div>
				<!-- end of div#content-top -->
				<div id="left-col">
					<div class="box">
						<h4 class="yellow">
							Side Menu
						</h4>
						<div class="box-container">
							<!-- use no-padding wherever you need element padding gone -->
							<ul class="list-links">
								<li>
									<a href="#">Manage Filters</a>
								</li>
								<li>
									<a href="#">Setup a New Site</a>
									<ul>
										<li>
											<a href="#">Configure Paths</a>
										</li>
										<li>
											<a href="#">Define Database Name</a>
										</li>
									</ul>
								</li>
								<li>
									<a href="#">Manage Site Accounts</a>
								</li>
							</ul>
						</div>
						<!--end of div.box-container -->
					</div>
					<!-- end of div.box -->
					<div class="box">
						<h4 class="light-blue">
							System Messages
						</h4>
						<div class="box-container">
							<div id="sys-messages-container">
								<h5>
									Latest Messages
									<span>(Opens Modal)</span>
								</h5>
								<ul>
									<li class="even-messages">
										<a href="#">Where is Everyone? New Stuff i...</a>
										<a href="#" class="sysmessage-delete"><img src="images/icon-delete-message.gif"
												alt=" " />
										</a>
									</li>
									<li class="odd-messages">
										<a href="#">Version 2 is Online. You can upd...</a>
										<a href="#" class="sysmessage-delete"><img src="images/icon-delete-message.gif"
												alt=" " />
										</a>
									</li>
								</ul>
							</div>
							<div id="quick-send-message-container">
								<h5>
									Quick Send
								</h5>
								<form id="form2" name="send-message-form" method="get" action="">
									<fieldset>
										<legend>
											Quick Send Message
										</legend>
										<p>
											<label>
												Message Title:
											</label>
											<input name="message-title" id="message-title" type="text" />
										</p>
										<p>
											<label>
												Content:
											</label>
											<textarea name="content" cols="10" rows="5"></textarea>
										</p>
										<div class="inner-nav">
											<div class="align-left">
												<input name="send-everyone" type="checkbox" value="" />
												To Everyone
											</div>
											<div class="align-right">
												<a href="#" onclick='javascript: document.forms['send-message-form'].submit();'><span>send</span>
												</a>
											</div>
											<span class="clearFix">&nbsp;</span>
										</div>
										<input class="hidden" name="button" type="button" value="Send Message" />
									</fieldset>
								</form>
							</div>
						</div>
						<!--end of div.box-container -->
					</div>
					<!--end of div.box -->
					<div class="box" id="to-do">
						<ul class="tab-menu">
							<li>
								<a href="#to-dos">To Do</a>
							</li>
							<li>
								<a href="#completed">Completed</a>
							</li>
						</ul>
						<div class="box-container" id="to-dos">
							<div id="to-do-list">
								<ul>
									<li class="even">
										<input name="check" type="checkbox" value="" />
										<a href="#">To Do Will Open in Modal Box</a>
										<br />
										<small><strong>Deadline:</strong>Today</small>
									</li>
									<li class="odd">
										<input name="check" type="checkbox" value="" />
										<a href="#">To Do Will Open in Modal Box</a>
										<br />
										<small><strong>Deadline:</strong>Today</small>
									</li>
									<li class="even">
										<input name="check" type="checkbox" value="" />
										<a href="#">To Do Will Open in Modal Box</a>
										<br />
										<small><strong>Deadline:</strong>Today</small>
									</li>
									<li class="odd">
										<input name="check" type="checkbox" value="" />
										<a href="#">To Do Will Open in Modal Box</a>
										<br />
										<small><strong>Deadline:</strong>Today</small>
									</li>
								</ul>
								<div class="inner-nav">
									<div class="align-left">
										<a href="#"><span>view all</span>
										</a>
									</div>
									<div class="align-right">
										<a href="#"><span>to-do config</span>
										</a>
									</div>
									<span class="clearFix">&nbsp;</span>
								</div>
							</div>
							<!-- end of div#to-do-list -->
						</div>
						<!-- end of div.box-container -->
						<div class="box-container" id="completed">
							Completed tasks div content
						</div>
					</div>
					<!-- end of div.box -->
				</div>
				<!-- end of div#left-col -->
				<div id="mid-col">
					<div class="box">
						<h4 class="white">
							Form Elements
						</h4>
						<div class="box-container">
							<form action="" method="post" class="middle-forms">
								<h3>
									Form Title
								</h3>
								<p>
									Please complete the form below. Mandatory fields marked
									<em>*</em>
								</p>
								<fieldset>
									<legend>
										Fieldset Title
									</legend>
									<ol>
										<li class="even">
											<label class="field-title">
												Short Textbox
												<em>*</em>:
											</label>
											<label>
												<input class="txtbox-short" />
												<span class="form-confirm-inline">Confirm Message</span>
											</label>
											<span class="clearFix">&nbsp;</span>
										</li>
										<li>
											<label class="field-title">
												Radio Boxes
												<em>*</em>:
											</label>
											<label>
												<input type="radio" name="variable" checked="checked" value="val1" />
												Radio1
												<input type="radio" name="variable" value="val2" />
												Radio2
											</label>
											<span class="clearFix">&nbsp;</span>
										</li>
										<li class="even">
											<label class="field-title">
												Mid Textbox:
											</label>
											<label>
												<input class="txtbox-middle" />
												<span class="form-error-inline">Error Message</span>
											</label>
											<span class="clearFix">&nbsp;</span>
										</li>
										<li>
											<label class="field-title">
												Select Menu:
											</label>
											<label>
												<select class="form-select">
													<option value="option1">
														Menu Option 1
													</option>
													<option value="option2">
														Menu Option 2
													</option>
												</select>
											</label>
											<span class="clearFix">&nbsp;</span>
										</li>
										<li class="even">
											<label class="field-title">
												Long Textbox:
											</label>
											<label>
												<input class="txtbox-long" />
											</label>
											<span class="clearFix">&nbsp;</span>
										</li>
										<li>
											<label class="field-title">
												Checkboxes:
											</label>
											<label>
												<input type="checkbox" name="check_one" value="check1" id="check_one" />
												Check
												<input type="checkbox" name="check_two" value="check2" id="check_two" />
												Check
											</label>
											<span class="clearFix">&nbsp;</span>
										</li>
										<li class="even">
											<label class="field-title">
												Textarea:
											</label>
											<label>
												<textarea id="wysiwyg" rows="7" cols="25"></textarea>
											</label>
											<span class="clearFix">&nbsp;</span>
										</li>
									</ol>
									<!-- end of form elements -->
								</fieldset>
								<p class="align-right">
									<input type="image" src="images/bt-send-form.gif" />
								</p>
								<span class="clearFix">&nbsp;</span>
							</form>
						</div>
						<!-- end of div.box-container -->
					</div>
					<!-- end of div.box -->
					<div class="box">
						<h4 class="white">
							Tables
							<a href="2-columns.html" class="heading-link">See Full Page Tabbed Tables Example</a>
						</h4>
						<div class="box-container">
							<table class="table-short">
								<thead>
									<tr>
										<td>
											Col1
										</td>
										<td>
											Col2
										</td>
										<td>
											Col3
										</td>
										<td>
											Col4
										</td>
									</tr>
								</thead>
								<tfoot>
									<tr>
										<td class="col-chk">
											<input type="checkbox" />
										</td>
										<td colspan="4">
											<div class="align-right">
												<select class="form-select">
													<option value="option1">
														Bulk Options
													</option>
													<option value="option2">
														Delete All
													</option>
												</select>
												<a href="#" class="button"><span>perform action</span>
												</a>
											</div>
										</td>
									</tr>
								</tfoot>
								<tbody>
									<tr class="odd">
										<td class="col-chk">
											<input type="checkbox" />
										</td>
										<td class="col-first">
											John Doe
										</td>
										<td class="col-second">
											<a href="#">johndoe@mail.com</a>
										</td>
										<td class="row-nav">
											<a href="#" class="table-edit-link">Edit</a>
											<span class="hidden"> | </span>
											<a href="#" class="table-delete-link">Delete</a>
										</td>
									</tr>
									<tr>
										<td class="col-chk">
											<input type="checkbox" />
										</td>
										<td class="col-first">
											Jane Doe
										</td>
										<td class="col-second">
											<a href="#">johndoe@mail.com</a>
										</td>
										<td class="row-nav">
											<a href="#" class="table-edit-link">Edit</a>
											<span class="hidden"> | </span>
											<a href="#" class="table-delete-link">Delete</a>
										</td>
									</tr>
									<tr class="odd">
										<td class="col-chk">
											<input type="checkbox" />
										</td>
										<td class="col-first">
											George Livingston
										</td>
										<td class="col-second">
											<a href="#">johndoe@mail.com</a>
										</td>
										<td class="row-nav">
											<a href="#" class="table-edit-link">Edit</a>
											<span class="hidden"> | </span>
											<a href="#" class="table-delete-link">Delete</a>
										</td>
									</tr>
									<tr>
										<td class="col-chk">
											<input type="checkbox" />
										</td>
										<td class="col-first">
											Lorem Ipsum Sit Amet
										</td>
										<td class="col-second">
											<a href="#">johndoe@mail.com</a>
										</td>
										<td class="row-nav">
											<a href="#" class="table-edit-link">Edit</a>
											<span class="hidden"> | </span>
											<a href="#" class="table-delete-link">Delete</a>
										</td>
									</tr>
									<tr class="odd">
										<td class="col-chk">
											<input type="checkbox" />
										</td>
										<td class="col-first">
											John Doe
										</td>
										<td class="col-second">
											<a href="#">johndoe@mail.com</a>
										</td>
										<td class="row-nav">
											<a href="#" class="table-edit-link">Edit</a>
											<span class="hidden"> | </span>
											<a href="#" class="table-delete-link">Delete</a>
										</td>
									</tr>
								</tbody>
							</table>
						</div>
						<!-- end of div.box-container -->
					</div>
					<!-- end of div.box -->
				</div>
				<!-- end of div#mid-col -->
				<div id="right-col">
					<div class="box">
						<h4 class="light-grey">
							Date &amp; Calendar
						</h4>
						<div class="box-container">
							<div id="date-container">
								<img src="images/sunny.png" alt="Sunny" />
								<span class="hour">22:54</span>
								<span class="date">18th May 2009<br />Friday</span>
								<span class="clearFix">&nbsp;</span>
							</div>
							<!-- end of div#box-date -->
							<div id="calendar-container">
								<h5>
									Calendar
								</h5>
								<div id="calendar"></div>
								<div class="inner-nav">
									<div class="align-left">
										<a href="#"><span>+ add event</span>
										</a>
									</div>
									<div class="align-right">
										<a href="#"><span>? list events</span>
										</a>
									</div>
									<span class="clearFix">&nbsp;</span>
								</div>
							</div>
							<!-- end of div#calendar-container -->
						</div>
						<!-- end of div.box-container -->
					</div>
					<!-- end of div.box -->
					<div class="box">
						<h4 class="light-blue">
							Quick Visual Links
						</h4>
						<div class="box-container">
							<ul id="quick-visual-links">
								<li>
									<a href="#"><img src="images/ql-settings.gif" alt="" />
										<br />Settings</a>
								</li>
								<li>
									<a href="#"><img src="images/ql-users.gif" alt="" />
										<br />Users</a>
								</li>
								<li>
									<a href="#"><img src="images/ql-messages.gif" alt="" />
										<br />Messages</a>
								</li>
								<li>
									<a href="#"><img src="images/ql-photos.gif" alt="" />
										<br />Photos</a>
								</li>
								<li>
									<a href="#"><img src="images/ql-media.gif" alt="" />
										<br />Media</a>
								</li>
								<li>
									<a href="#"><img src="images/ql-design.gif" alt="" />
										<br />Design</a>
								</li>
								<li>
									<a href="#"><img src="images/ql-options.gif" alt="" />
										<br />Options</a>
								</li>
								<li>
									<a href="#"><img src="images/ql-databases.gif" alt="" />
										<br />Databases</a>
								</li>
								<li>
									<a href="#"><img src="images/ql-paths.gif" alt="" />
										<br />File Paths</a>
								</li>
							</ul>
							<span class="clearFix">&nbsp;</span>
						</div>
						<!-- end of div.box-container -->
					</div>
					<!-- end of div.box -->
				</div>
				<!-- end of div#right-col -->
				<span class="clearFix">&nbsp;</span>
